<script setup>
import { ref } from 'vue'

// 响应式数据
const intro = ref({
  title: '项目功能简介',
  content: '这是一个社团管理系统，主要功能包括：\n1. 用户信息管理\n2. 社团信息管理\n3. 社团活动信息管理'
})
</script>

<template>
  <div class="intro-box">
    <h2>{{ intro.title }}</h2>
    <pre>{{ intro.content }}</pre>
  </div>
</template>

<style>
.intro-box {
  width: 100%;
  background: #f8f9fa;
  padding: 20px;
  border-radius: 8px;
  margin-bottom: 30px;
}

pre {
  white-space: pre-wrap;
  line-height: 1.6;
  color: #34495e;
}
</style>
